<template>
	<view class="uni-popup-share">
		<view class="uni-share-title"><text class="uni-share-title-text">{{title}}</text></view>
		<view class="uni-share-content">
			<view class='share-box'>
				<scroll-view class="listview" style="flex: 1;" enableBackToTop="true" scroll-y @scrolltolower="loadMore()">
					<view class='content-item' v-for="(item, index) in importDate" :key="index" @click.stop="select(item,index)">
						<text>
							{{item.name}}
						</text>
					</view>

				</scroll-view>
			</view>
		</view>
		<view class="uni-share-button-box">
			<view style='width: 100%;color: gray;text-align: center;font-size: 15px;' @click="close">
				取消
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: 'UniPopupShare',
		props: {
			title: {
				type: String,
				default: '分享到'
			},
			importDate: {
				type: Object / Array,
				default: () => {
					return []
				}
			},
		},
		inject: ['popup'],
		data() {
			return {
				isLoading: false,
			}
		},
		created() {},
		methods: {
			loadMore() {

			},
			/**
			 * 选择内容
			 */
			select(item, index) {
				this.$emit('select', {
					item,
					index
				}, () => {
					this.popup.close()
				})
			},
			/**
			 * 关闭窗口
			 */
			close() {
				this.popup.close()
			}
		}
	}
</script>
<style lang="scss" scoped>
	.uni-popup-share {
		background-color: #fff;
	}

	.uni-share-title {
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: row;
		align-items: center;
		justify-content: center;
		height: 50px;
		border-bottom: 1px solid #d0c8c8;
	}

	.uni-share-title-text {
		font-size: 14px;
		color: #a2a2a2;
	}

	.uni-share-content {
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: row;
		justify-content: center;
		
	}

	.uni-share-content-item:active {
		background-color: #f5f5f5;
	}

	.uni-share-image {
		width: 30px;
		height: 30px;
	}

	.uni-share-text {
		margin-top: 10px;
		font-size: 14px;
		color: #3B4144;
	}

	.uni-share-button-box {
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: row;
		padding: 10px 15px;
	}

	.uni-share-button {
		flex: 1;
		border-radius: 50px;
		color: #666;
		font-size: 16px;
	}

	.uni-share-button::after {
		border-radius: 50px;
	}

	.share-box {
		// overflow-y: auto;
		// height: 200px;
	}

	.share-item {}

	.listview {
		height: 100px;
		width: calc(100vw);
	}

	.content-item {
		text-align: center;
		font-size: 15px;
		height: 50px;
		border-bottom: 1px solid #d0c8c8;
		line-height: 50px;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #3296FA;
	}
</style>
